layui.use(['admin', 'ax','jquery','laydate'], function () {
    var $ax = layui.ax;
    var admin = layui.admin;
    var $ = layui.$;
    var laydate = layui.laydate;

    var color = ["#7fbe9e","blue","#ffb716","red"];
    var backgroundColor = '#010622';


    //时间控件
    laydate.render({
        elem: '#start_time'
        ,type: 'datetime'
        ,done: function(value, date){
            console.log(value);
            console.log(date);
        }
    });
    laydate.render({
        elem: '#end_time'
        ,type: 'datetime'
        ,done: function(value, date){
            console.log(value);
            console.log(date);
        }
    });


    //何在分布加载开始
    var pie_option1 = {
        title : {
            text: '荷载分布',
            subtext: '',
            x:'center'
        },
        backgroundColor:backgroundColor,
        color:color,
        tooltip : {
            trigger: 'item',
            formatter: "{b} : {c} ({d}%)"
        },
        legend: {
            orient: 'vertical',
            left: 'left',
            data: ['重型荷载','轻型荷载']
        },
        series : [
            {
                name: '',
                type: 'pie',
                radius : '55%',
                center: ['50%', '60%'],
                data:[
                    {value:335, name:'重型荷载'},
                    {value:310, name:'轻型荷载'},
                ],
                itemStyle: {
                    emphasis: {
                        shadowBlur: 10,
                        shadowOffsetX: 0,
                        shadowColor: 'rgba(0, 0, 0, 0.5)'
                    }
                }
            }
        ]
    };
    var pieChart1 = echarts.init(document.getElementById('pie1'));
    pieChart1.setOption(pie_option1);
    //荷载加载结束

    //温度挠度实时数据加载开始
    var line_option = {
        legend: {
            orient: 'horizontal', // 'vertical'
            x: 'center', // 'center' | 'left' | {number},
            y: 'top', // 'center' | 'bottom' | {number}
            backgroundColor: backgroundColor,
            borderColor: 'rgba(178,34,34,0.8)',
            // borderWidth: 4,
            // padding: 10,    // [5, 10, 15, 20]
            // itemGap: 20,
            textStyle: {color: '#fff'},

            data: [
                '温度 °C','挠度 ml',
            ]
        },
        backgroundColor:backgroundColor,
        color:color,
        xAxis :{
            data : ['周一','周二','周三','周四','周五','周六','周日']
        },
        yAxis : [
            {
                type : 'value',
                axisLabel : {
                    formatter: '{value}',
                    textStyle:{
                        color:"#fff"
                    }
                },
                splitLine : {show : false},
            },
            {
                type : 'value',
                axisLabel : {
                    formatter: '{value}',
                    textStyle:{
                        color:"#fff"
                    }
                }
            }

        ],
        series : [
            {
                name:'温度 °C',
                type:'line',
                data:[2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6]
            },
            {
                name:'挠度 mm',
                type:'line',
                yAxisIndex: 1,
                data:[11, 11, 15, 13, 12, 13, 10]
            }

        ]
    };
    var lineChart = echarts.init(document.getElementById('line'));
    lineChart.setOption(line_option);

    //温度挠度实时数据加载结束

    //挠度极限预警加载开始
    var pie_option2 = {
        title : {
            text: '挠度极限预警',
            subtext: '',
            x:'right'
        },
        tooltip : {
            trigger: 'item',
            formatter: "{b} : {c} ({d}%)"
        },
        legend: {
            orient: 'vertical',
            left: 'left',
            data: ['储备占比','安全占比','预警占比','报警占比']
        },
        backgroundColor:backgroundColor,
        color:color,
        series : [
            {
                name: '',
                type: 'pie',
                radius : '55%',
                center: ['50%', '60%'],
                data:[
                    {value:335, name:'储备占比'},
                    {value:310, name:'安全占比'},
                    {value:310, name:'预警占比'},
                    {value:335, name:'报警占比'},
                ],
                itemStyle: {
                    emphasis: {
                        shadowBlur: 10,
                        shadowOffsetX: 0,
                        shadowColor: 'rgba(0, 0, 0, 0.5)'
                    }
                }
            }
        ]
    };
    var pieChart2 = echarts.init(document.getElementById('pie2'));
    pieChart2.setOption(pie_option2);
    //挠度极限预警加载结束

    //突发荷载预警开始
    var point_option = {
        title : {
            text: '突发预警荷载',
            subtext: '',
            x:'right'
        },
        tooltip : {
            // trigger: 'axis',
            showDelay : 0,
            formatter : function (params) {
                if (params.value.length > 1) {
                    return params.seriesName + ' :<br/>'
                        + params.value[0] + 'cm '
                        + params.value[1] + 'kg ';
                }
                else {
                    return params.seriesName + ' :<br/>'
                        + params.name + ' : '
                        + params.value + 'kg ';
                }
            },
            axisPointer:{
                show: true,
                type : 'cross',
                lineStyle: {
                    type : 'dashed',
                    width : 1
                }
            }
        },
        legend: {
            orient: 'vertical',
            data: ['6秒','60秒'],
            left: 'left'
        },
        backgroundColor:backgroundColor,
        color:color,
        xAxis : [
            {
                type : 'value',
                scale:true,
                axisLabel : {
                    formatter: '{value} ',
                    textStyle: {
                        color: '#fff'
                    }
                },
                splitLine: {
                    show: false
                }
            }
        ],
        yAxis : [
            {
                type : 'value',
                scale:true,
                axisLabel : {
                    formatter: '{value} ',
                    textStyle: {
                        color: '#fff'
                    }
                },
                splitLine: {
                    show: false
                }
            }
        ],
        series : [
            {
                name:'6秒',
                type:'scatter',
                data: [[161.2, 51.6], [167.5, 59.0], [159.5, 49.2], [157.0, 63.0], [155.8, 53.6],
                    [170.0, 59.0], [159.1, 47.6], [166.0, 69.8], [176.2, 66.8], [160.2, 75.2],
                    [172.5, 55.2], [170.9, 54.2], [172.9, 62.5], [153.4, 42.0], [160.0, 50.0],
                    [147.2, 49.8], [168.2, 49.2], [175.0, 73.2], [157.0, 47.8], [167.6, 68.8],
                    [159.5, 50.6], [175.0, 82.5], [166.8, 57.2], [176.5, 87.8], [170.2, 72.8]
                ]
            },
            {
                name:'60秒',
                type:'scatter',
                data: [[174.0, 65.6], [175.3, 71.8], [193.5, 80.7], [186.5, 72.6], [187.2, 78.8],
                    [181.5, 74.8], [184.0, 86.4], [184.5, 78.4], [175.0, 62.0], [184.0, 81.6],
                    [180.0, 76.6], [177.8, 83.6], [192.0, 90.0], [176.0, 74.6], [174.0, 71.0],
                    [184.0, 79.6], [192.7, 93.8], [171.5, 70.0], [173.0, 72.4], [176.0, 85.9],
                    [176.0, 78.8], [180.5, 77.8], [172.7, 66.2], [176.0, 86.4], [173.5, 81.8]
                ]
            }
        ]
    };

    var pointChart = echarts.init(document.getElementById('point'));
    pointChart.setOption(point_option);
    //突发荷载预警结束

    //疲劳预警开始
    var bar_option = {
        title : {
            text: '疲劳预警',
            subtext: '',
            x:'right'
        },
        backgroundColor:backgroundColor,
        color:color,
        legend: {
            orient: 'vertical',
            left:"left"
        },
        tooltip: {},
        dataset: {
            dimensions: ['product', '2015', '2016', '2017'],
            source: [
                {product: '0 °C', '2015': 43.3, '2016': 85.8, '2017': 93.7},
                {product: '5 °C', '2015': 83.1, '2016': 73.4, '2017': 55.1},
                {product: '10 °C', '2015': 86.4, '2016': 65.2, '2017': 82.5},
                {product: '15 °C', '2015': 72.4, '2016': 53.9, '2017': 39.1}
            ]
        },
        xAxis: {
            type: 'category',
            axisLabel: {
                show: true,
                textStyle: {
                    color: '#fff'
                }
            }
        },
        yAxis: {
            axisLabel: {
                show: true,
                textStyle: {
                    color: '#fff'
                }
            }
        },
        // Declare several bar series, each will be mapped
        // to a column of dataset.source by default.
        series: [
            {type: 'bar'},
            {type: 'bar'},
            {type: 'bar'}
        ]
    };
    //疲劳预警结束

    // var  barChart= echarts.init(document.getElementById('bar'));
    // barChart.setOption(bar_option);

    //温度挠度实时数据加载开始
    var line_option2 = {
        legend: {
            orient: 'horizontal', // 'vertical'
            x: 'center', // 'center' | 'left' | {number},
            y: 'top', // 'center' | 'bottom' | {number}
            backgroundColor: backgroundColor,
            borderColor: 'rgba(178,34,34,0.8)',
            textStyle: {color: '#fff'},

            data: [
                '2015','2016',
            ]
        },
        backgroundColor:backgroundColor,
        color:color,
        xAxis :{
            data : ['周一','周二','周三','周四','周五','周六','周日']
        },
        yAxis : [
            {
                type : 'value',
                axisLabel : {
                    formatter: '{value}',
                    textStyle:{
                        color:"#fff"
                    }
                }
            }

        ],
        series : [
            {
                name:'2015',
                type:'line',
                data:[13.0, 13.1, 13.0, 13.1, 13.2, 12.9, 13.0]
            },
            {
                name:'2016',
                type:'line',
                data:[11, 11, 15, 13, 12, 13, 10]
            }

        ]
    };

    var lineChart2 = echarts.init(document.getElementById('line2'));
    lineChart2.setOption(line_option2);



});



